/*
  学习目标：hooks补充- useHistory
  1. useRef: 在函数组件创建ref对象
  2. useHistory: 获取history对象, 使用范围更广： 1. 函数式组件  2. 自定义hooks
  3. useLocation: 获取location对象，使用范围更广

  */
import React from 'react';

import { BrowserRouter as Router, Route, useHistory, useLocation } from 'react-router-dom';
import { Switch } from 'react-router-dom';

export default function App() {
  return (
    <Router>
      <Switch>
        <Route path="/home" component={Home}></Route>
        <Route path="/main" component={Main}></Route>
      </Switch>
      <Header></Header>
    </Router>
  );
}

function Header() {
  const xxx = useLocation();
  console.log('  ----->  ', xxx);
  return <h1>Header</h1>;
}

function Home(props) {
  console.log('props.history  ----->  ', props.location);
  return <h1>Home</h1>;
}

function Main() {
  return <h1>Main</h1>;
}
